import Vue from 'vue'
import VueRouter from 'vue-router'
import Home from '../views/Home.vue'
import About from '../views/About.vue'
import Four from '@/components/Four.vue'
import Childrens from '@/components/Childrens.vue'
import Children1 from '@/components/Children1.vue'
import Bar from '@/components/Bar.vue'

Vue.use(VueRouter)

const routes = [
  {
    // path: '/:id?',
    path: '/',
    name: 'Home',
    component: Home
  },
  {
    path: '/about/:username/post/:post_id',
    name: 'About',
    component: About
  },
  {
    path: '/four-*',
    name: 'Four',
    component: Four,
    children: [{
      path: 'childrens',
      name: 'Childrens',
      component: Childrens,
      children: [{
        path: 'children1',
        name: 'Children1',
        component: Children1,
      }]
    }]
  },
  {
    path: '/bar',
    name: 'Bar',
    component: Bar,
    meta: { requiresAuth: true },
    // beforeEnter: (to, from, next) => {
    //   console.log(to,from)
    //   next()
    // }
  },
  {
    path: '/foo',
    name: 'Foo',
    // component: ()=>import("@/components/Foo"),
    component: resolve => (require(["@/components/Foo"], resolve))  // 异步组件实现懒加载
  }
]

const router = new VueRouter({
  mode: 'history',
  base: process.env.BASE_URL,
  routes
})

// 全局前置守卫
// router.beforeEach((to, from, next) => {
//   console.log(to)
//   console.log(from)
//   if(to.path == '/bar'){
//     next('/')
//   }else{
//     next()
//   }
//   // next(false)
// })

// 全局解析守卫
// router.beforeResolve ((to, from, next) => {
//   console.log(to)
//   console.log(from)
//   next()
// })

// 全局后置钩子
// router.afterEach((to, from) => {
//   console.log(to)
//   console.log(from)
// })

export default router
